<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui">

	<h:form id="form">
		<p:dataList value="#{dashboardControler.visites}" var="personne" id="personnes"
	        paginator="true" rows="10" effectSpeed="fast" 
	        paginatorTemplate="{PreviousPageLink} {CurrentPageReport} {NextPageLink} {RowsPerPageDropdown}"
	        rowsPerPageTemplate="5,10,15" type="none">
			
			<p:column>
			    <p:commandButton icon="ui-icon-search" update=":form" 
			    	oncomplete="detailPersonneDialog.show()" title="Detail personne">
			        <f:setPropertyActionListener value="#{personne}" target="#{dashboardControler.selectedPersonne}" />
			    </p:commandButton>
				
			    <h:outputText value="#{personne} - #{personne.adresse} - " style="margin-left:10px" />
			    <h:outputText style="font-weight:bold" value="#{personne.derniereVisite}">
					<f:convertDateTime timeZone="GMT+3" pattern="dd/MM/yyyy" />
				</h:outputText>
			    <br />
			</p:column>
	    </p:dataList>
	    
		<p:dialog header="Detail de la personne"
			widgetVar="detailPersonneDialog" resizable="false" width="770"
			showEffect="clip" hideEffect="clip">
			<h:panelGrid id="detail" columns="3" cellpadding="1">
				<h:panelGrid columns="2" cellpadding="1" width="250">
					<h:outputText value="Nom" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.nom}" />
	
					<h:outputText value="Prenom" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.prenom}" />
	
					<h:outputText value="Adresse" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.adresse.nomDeRue}" />
	
					<h:outputText value="Ville" />
					<h:outputText  style="font-weight:bold" value="#{dashboardControler.selectedPersonne.adresse.codePostal} #{selectedPersonne.adresse.ville}" />
					
					<h:outputText value="Email" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.adresse.email}" />
						
				</h:panelGrid>
				
				<h:panelGrid columns="2" cellpadding="1" width="250">
	
					<h:outputText value="Telephone domicile" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.adresse.telDomicile}" />
	
					<h:outputText value="Telephone portable" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.adresse.telPortable}" />
					
					<h:outputText value="Date de naissance" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.dateDeNaissance}">
						<f:convertDateTime timeZone="GMT+3" pattern="dd/MM/yyyy" />
					</h:outputText>
					
					<h:outputText value="Dernière visite" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.derniereVisite}">
						<f:convertDateTime timeZone="GMT+3" pattern="dd/MM/yyyy" />
					</h:outputText>
					
					<h:outputText value="Hotesse" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.hotesse}" />
				
				</h:panelGrid>
				
				<h:panelGrid columns="2" cellpadding="1" width="240">
					
					<h:outputText value="Individuelle" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.individuelle  ? 'Oui' : 'Non'}" />
					
					<h:outputText value="Taille haut" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.tailleHaut}" />
					
					<h:outputText value="Taille bas" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.tailleBas}" />
					
					<h:outputText value="Commentaire" />
					<h:outputText style="font-weight:bold" value="#{dashboardControler.selectedPersonne.commentaires}" />
					
				</h:panelGrid>
			</h:panelGrid>
		</p:dialog>
	 </h:form>
</ui:composition>